<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>忘记密码</title>
		<link rel="stylesheet" type="text/css" href="/front/css/headfoot.css"/>
		<link rel="stylesheet" type="text/css" href="/front/css/login.css"/>
		<link rel="stylesheet" type="text/css" href="/front/css/forgetpwd.css"/>
	</head>
	<body>
		<!--顶部开始-->
		<header>
			<div id="login-header">
				<div class="login-header-middle">
					<div class="login-header-left">
						<a href={php} echo url('/web/index','','','www') {/php} title="首页">
							<i></i>
							<span class="login-shsy">双辉旅程网</span>
						</a>
						<span class="wel-login">找回密码</span>
					</div>
				</div>
			</div>
		</header>
		<!--顶部结束-->
		<!--忘记密码开始-->
		<div id="forgetpwd-box">
			<div class="forgetpwd-bg-img">
				<form action="javascript:;" method="get" id="forgetpwdform">
					<div class="forgetpwd-form">
						<div class="forgetpwd-account">
							<p class="account-p">找回密码</p>
						</div>
						<div class="form-group-input">
							<div class="input-title">登录账号 <span id="phoneerror"></span></div>
							<input type="text" name="phone" id="phone"  placeholder="请输入已注册的手机号码"/>
						</div>
						<div class="form-group-input form-input-code">
							<div class="input-title">图片验证码<span id="codeerror"></span></div>
							<div>
								<input type="text" name="imgCode"  placeholder="请输入图片验证码"/>
								<img  id="captcha_img" style="cursor: pointer;" onclick="this.src='{:captcha_src()}?d='+Math.random();" alt="点击更换" title="点击更换" src="{:captcha_src()}" class="m">
							</div>
							
						</div>
						<div class="form-group-input">
							<button id="aa" type="submit">确<i style="padding: 0px 5px;"></i>定</button>
						</div>
					</div>
				</form>
			</div>
		</div>
		<!--忘记密码结束-->
	<script type="text/javascript" src="/jquery.js"></script>
	<script type="text/javascript">
	      $(document).ready(function(){
	        //提交表单
	        $("#aa").click(function(){
	        $("#forgetpwdform").attr('action','/userforgotpwd/forgetpwdform');
	        $("#forgetpwdform").submit();
	          });

	        });  
	</script>
    <script type="text/javascript">
    	$(function(){
    		//账号验证
    		$("input[name='phone']").blur(function(){
    			var phone = $('input[name="phone"]').val();
    			//不能为空
    			if(!$.trim(phone)) {
					$("input[name='phone']").css({border: "1px solid red"}).siblings('span').html("请输入您的账号");
					return false;
    			}
    			//手机号或邮箱是否满足
    			if((/^1[3|4|5|7|8]\d{9}$/.test(phone)) || (/(^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+\.[a-zA-Z0-9_-]+$)|(^$)/.test(phone))){
					$("input[name='phone']").css({border: ""});
					$("#phoneerror").html("");
					$.get('/userforgotpwd/checkphone?phone='+$("input[name='phone']").val(),function(data) {
						$("input[name='phone']").css({border: "1px solid green"});
						$("#phoneerror").html("");
						if (data===0) {
							$("input[name='phone']").css({border: "1px solid red"});
							$("#phoneerror").html("手机号未注册");
						}
					});
    			}else {
					$("input[name='phone']").css({border: "1px solid red"});
					$("#phoneerror").html("手机号格式不正确");
					return false;
    			}
    		})
    		//图片验证码验证
    		$('input[name="imgCode"]').keyup(function(){
    			var imgCodele = $('input[name="imgCode"]').val().length;
    			if (imgCodele>3) {
    				var imgCode = $('input[name="imgCode"]').val();
    			//不能为空
    			if(!$.trim(imgCode)) {
					$("input[name='imgCode']").css({border: "1px solid red"});
					$("#codeerror").html("请输入验证码");
					return false;
    			}else {
    				$.get('/user/checkcode?imgCode='+$("input[name='imgCode']").val(),function(data) {
						$("input[name='imgCode']").css({border: "1px solid green"});
						$("#codeerror").html("");
						if (data===0) {
							$("input[name='imgCode']").css({border: "1px solid red"});
							$("#codeerror").html("验证码错误");
						}
					});
    				}
    			}
 			})	
    	})
    </script>

	<!--公共底部开始-->
	{include file='./base/footer'}
	<!--公共底部结束-->
	</body>
</html>
